<template>
  <div class="bw-node-attr-value">
    <template v-if="valueFrom === BwAttrFromTypeEnum.constValue">
      <component
        :is="curConstEle"
        v-bind="curConstEleBindProps"
        v-on="curConstEleEmits"
      />
    </template>

    <template v-else-if="valueFrom === BwAttrFromTypeEnum.comVar">
      <a-input
        class="input"
        v-model:value="curComVarName"
        @change="onChangeAttrValue(curComVarName)"
      />
    </template>

    <template v-else-if="valueFrom === BwAttrFromTypeEnum.comProps">
      <a-select
        class="input"
        style="width: 100%"
        :options="curCurtomComPropList"
        v-model:value="curComParamName"
        @change="onChangeAttrValue(curComParamName)"
      />
    </template>

    <template v-else-if="valueFrom === BwAttrFromTypeEnum.JSExpression">
      <a-button :block="true" type="primary" @click="curVisible = true">
        表达式定义
      </a-button>
    </template>

    <BwJSExtend
      v-model:visible="curVisible"
      :value="curJSExpression"
      @ok="onChangeJSExpression"
    />
  </div>
</template>

<script lang="ts" setup>
import { useNodeAttrValue } from './util'

import BwJSExtend from '../../../../coms/JSExtend/index.vue'

import {
  BwCustomComNodeAttrFromTypeEnum as BwAttrFromTypeEnum,
  BwCustomComNodeAttrDataTypeEnum as BwAttrDataTypeEnum,
  type BwCustomComNodeAttrModel,
} from '@bitwit/base-com-render'
import type { BwCurNodeAttrInfoModel } from '../model'
interface BwNodeAttrValueProps {
  valueFrom: BwAttrFromTypeEnum
  valueDataType: Nullable<BwAttrDataTypeEnum>
  attrInfo: BwCurNodeAttrInfoModel
  attrData: Record<string, BwCustomComNodeAttrModel>
}

const emit = defineEmits(['change'])
const props = withDefaults(defineProps<BwNodeAttrValueProps>(), {
  valueFrom: BwAttrFromTypeEnum.constValue,
  valueDataType: BwAttrDataTypeEnum.string,
})

const {
  curVisible,
  curConstEle,
  curComVarName,
  curComParamName,
  curJSExpression,
  curConstEleEmits,
  curConstEleBindProps,
  curCurtomComPropList,

  onChangeAttrValue,
  onChangeJSExpression,
} = useNodeAttrValue(props, emit)
</script>

<style lang="less" scoped></style>
